.effeckt-off-screen-nav ~ [data-effeckt-page].effeckt-page-active:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  background: rgba(0, 0, 0, 0.2);
  opacity: 0;
  visibility: hidden;
  transition: 500ms; }
.effeckt-off-screen-nav.effeckt-show ~ [data-effeckt-page].effeckt-page-active:after {
  opacity: 1;
  visibility: visible; }

.effeckt-off-screen-nav-left-overlay {
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%);
  transition: 500ms cubic-bezier(0.09, 0.68, 0, 0.99); }
  .effeckt-off-screen-nav-left-overlay.effeckt-show {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }

.effeckt-off-screen-nav-left-push {
  -webkit-transform: translateX(-12rem);
      -ms-transform: translateX(-12rem);
          transform: translateX(-12rem);
  transition: 500ms; }
  .effeckt-off-screen-nav-left-push.effeckt-show {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
    .effeckt-off-screen-nav-left-push.effeckt-show ~ [data-effeckt-page].effeckt-page-active {
      -webkit-transform: translateX(12rem);
          -ms-transform: translateX(12rem);
              transform: translateX(12rem); }
  .effeckt-off-screen-nav-left-push ~ [data-effeckt-page].effeckt-page-active {
    transition: 500ms;
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }

.effeckt-off-screen-nav-left-reveal {
  width: 0px;
  -webkit-transform: translate3D(0, 0, 0);
      -ms-transform: translate3D(0, 0, 0);
          transform: translate3D(0, 0, 0);
  transition: 500ms; }
  .effeckt-off-screen-nav-left-reveal h4 {
    width: 10rem; }
  .effeckt-off-screen-nav-left-reveal.effeckt-show {
    width: 12rem;
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
    .effeckt-off-screen-nav-left-reveal.effeckt-show ~ [data-effeckt-page] {
      -webkit-transform: translateX(12rem);
          -ms-transform: translateX(12rem);
              transform: translateX(12rem); }
  .effeckt-off-screen-nav-left-reveal ~ [data-effeckt-page] {
    transition: 500ms; }

.effeckt-off-screen-nav-left-squeeze {
  width: 40%;
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%);
  transition: 500ms; }
  .effeckt-off-screen-nav-left-squeeze.effeckt-show {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
    .effeckt-off-screen-nav-left-squeeze.effeckt-show ~ [data-effeckt-page] {
      width: 60%; }
  .effeckt-off-screen-nav-left-squeeze ~ [data-effeckt-page] {
    float: right;
    transition: width 500ms;
    max-width: none; }

.effeckt-off-screen-nav-right-overlay {
  right: 0;
  left: auto;
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
  transition: 500ms cubic-bezier(0.09, 0.68, 0, 0.99); }
  .effeckt-off-screen-nav-right-overlay.effeckt-show {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }

.effeckt-off-screen-nav-right-push {
  left: auto;
  right: 0;
  -webkit-transform: translateX(12rem);
      -ms-transform: translateX(12rem);
          transform: translateX(12rem);
  transition: 500ms; }
  .effeckt-off-screen-nav-right-push.effeckt-show {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
    .effeckt-off-screen-nav-right-push.effeckt-show ~ [data-effeckt-page] {
      -webkit-transform: translateX(-12rem);
          -ms-transform: translateX(-12rem);
              transform: translateX(-12rem); }
  .effeckt-off-screen-nav-right-push ~ [data-effeckt-page] {
    transition: 500ms; }

.effeckt-off-screen-nav-right-reveal {
  width: 0;
  overflow: hidden;
  left: auto;
  right: 0;
  -webkit-transform: translate3D(0, 0, 0);
      -ms-transform: translate3D(0, 0, 0);
          transform: translate3D(0, 0, 0);
  transition: 500ms; }
  .effeckt-off-screen-nav-right-reveal h4 {
    width: 10rem;
    position: absolute;
    top: 0px;
    right: 0; }
  .effeckt-off-screen-nav-right-reveal ul {
    width: 12rem;
    position: absolute;
    top: 3.2rem;
    right: 0; }
  .effeckt-off-screen-nav-right-reveal.effeckt-show {
    width: 12rem; }
    .effeckt-off-screen-nav-right-reveal.effeckt-show ~ [data-effeckt-page] {
      -webkit-transform: translateX(-12rem);
          -ms-transform: translateX(-12rem);
              transform: translateX(-12rem); }
  .effeckt-off-screen-nav-right-reveal ~ [data-effeckt-page] {
    transition: 500ms; }

.effeckt-off-screen-nav-right-squeeze {
  left: auto;
  right: 0;
  width: 40%;
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
  transition: 500ms; }
  .effeckt-off-screen-nav-right-squeeze.effeckt-show {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
    .effeckt-off-screen-nav-right-squeeze.effeckt-show ~ [data-effeckt-page] {
      width: 60%; }
  .effeckt-off-screen-nav-right-squeeze ~ [data-effeckt-page] {
    float: left;
    transition: width 500ms;
    max-width: none; }

.effeckt-off-screen-nav-left-rotate {
  -webkit-transform-origin: 100% 50%;
      -ms-transform-origin: 100% 50%;
          transform-origin: 100% 50%;
  transition: 500ms;
  -webkit-transform: translateX(-100%) scale(1.01) rotateY(-30deg);
          transform: translateX(-100%) scale(1.01) rotateY(-30deg); }
  .effeckt-off-screen-nav-left-rotate ~ [data-effeckt-page].effeckt-page-active {
    -webkit-transform-origin: 0 50%;
        -ms-transform-origin: 0 50%;
            transform-origin: 0 50%;
    transition: 500ms; }
  .effeckt-off-screen-nav-left-rotate ~ .effeckt-overlay {
    z-index: 900;
    visibility: visible;
    opacity: 1; }
  .effeckt-off-screen-nav-left-rotate.effeckt-show {
    -webkit-transform: none;
        -ms-transform: none;
            transform: none; }
    .effeckt-off-screen-nav-left-rotate.effeckt-show ~ [data-effeckt-page].effeckt-page-active {
      -webkit-transform: translateX(260px) rotateY(15deg);
              transform: translateX(260px) rotateY(15deg);
      overflow: hidden; }
      .effeckt-off-screen-nav-left-rotate.effeckt-show ~ [data-effeckt-page].effeckt-page-active:after {
        background: none; }
    .effeckt-off-screen-nav-left-rotate.effeckt-show ~ [data-effeckt-page] .off-screen-nav-cover {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

.effeckt-off-screen-nav-top-overlay {
  width: 100%;
  bottom: auto;
  transition: 500ms;
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%); }
  .effeckt-off-screen-nav-top-overlay.effeckt-show {
    visibility: visible;
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }

.effeckt-off-screen-nav-bottom-overlay {
  width: 100%;
  top: auto;
  transition: 500ms;
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%); }
  .effeckt-off-screen-nav-bottom-overlay.effeckt-show {
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }

.effeckt-off-screen-nav-top-bounce {
  width: 100%;
  bottom: auto;
  transition: 500ms; }
  .effeckt-off-screen-nav-top-bounce.effeckt-show {
    visibility: visible;
    -webkit-animation: navFromTopBounceIn 500ms both ease;
            animation: navFromTopBounceIn 500ms both ease; }
  .effeckt-off-screen-nav-top-bounce.effeckt-hide {
    -webkit-animation: navFromTopBounceOut 500ms both ease;
            animation: navFromTopBounceOut 500ms both ease; }

.effeckt-off-screen-nav-top-bounce-out {
  width: 100%;
  bottom: auto;
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);
  transition: 500ms; }
  .effeckt-off-screen-nav-top-bounce-out.effeckt-show {
    visibility: visible;
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }
  .effeckt-off-screen-nav-top-bounce-out.effeckt-hide {
    -webkit-animation: navFromTopBounceOut 500ms both ease;
            animation: navFromTopBounceOut 500ms both ease; }

@-webkit-keyframes navFromTopBounceIn {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); }

  20% {
    padding-top: 0px;
    -webkit-transform: translateY(0%);
            transform: translateY(0%); }

  60% {
    padding-top: 20px; }

  100% {
    padding-top: 0; } }

@keyframes navFromTopBounceIn {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); }

  20% {
    padding-top: 0px;
    -webkit-transform: translateY(0%);
            transform: translateY(0%); }

  60% {
    padding-top: 20px; }

  100% {
    padding-top: 0; } }

@-webkit-keyframes navFromTopBounceOut {
  0% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding-top: 0px; }

  40% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding-top: 20px; }

  80% {
    padding-top: 0px; }

  90%, 100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); } }

@keyframes navFromTopBounceOut {
  0% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding-top: 0px; }

  40% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding-top: 20px; }

  80% {
    padding-top: 0px; }

  90%, 100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); } }

.effeckt-off-screen-nav-bottom-bounce {
  width: 100%;
  top: auto;
  transition: 500ms; }
  .effeckt-off-screen-nav-bottom-bounce.effeckt-show {
    -webkit-animation: navFromBottomBounceIn 500ms both ease;
            animation: navFromBottomBounceIn 500ms both ease; }
  .effeckt-off-screen-nav-bottom-bounce.effeckt-hide {
    -webkit-animation: navFromBottomBounceOut 500ms both ease;
            animation: navFromBottomBounceOut 500ms both ease; }

.effeckt-off-screen-nav-bottom-bounce-out {
  width: 100%;
  top: auto;
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%);
  transition: 500ms; }
  .effeckt-off-screen-nav-bottom-bounce-out.effeckt-show {
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }
  .effeckt-off-screen-nav-bottom-bounce-out.effeckt-hide {
    -webkit-animation: navFromBottomBounceOut 500ms both ease;
            animation: navFromBottomBounceOut 500ms both ease; }

@-webkit-keyframes navFromBottomBounceIn {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%); }

  20% {
    padding-bottom: 0px;
    -webkit-transform: translateY(0%);
            transform: translateY(0%); }

  60% {
    padding-bottom: 20px; }

  100% {
    padding-bottom: 0; } }

@keyframes navFromBottomBounceIn {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%); }

  20% {
    padding-bottom: 0px;
    -webkit-transform: translateY(0%);
            transform: translateY(0%); }

  60% {
    padding-bottom: 20px; }

  100% {
    padding-bottom: 0; } }

@-webkit-keyframes navFromBottomBounceOut {
  0% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding-bottom: 0px; }

  40% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding-bottom: 20px; }

  80% {
    padding-bottom: 0; }

  90%, 100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%); } }

@keyframes navFromBottomBounceOut {
  0% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding-bottom: 0px; }

  40% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding-bottom: 20px; }

  80% {
    padding-bottom: 0; }

  90%, 100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%); } }

.effeckt-off-screen-nav-push-top {
  width: 100%;
  bottom: auto;
  transition: 500ms;
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%); }
  .effeckt-off-screen-nav-push-top.effeckt-show {
    visibility: visible;
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }
    .effeckt-off-screen-nav-push-top.effeckt-show ~ [data-effeckt-page] {
      -webkit-transform: translateY(12rem);
          -ms-transform: translateY(12rem);
              transform: translateY(12rem); }
  .effeckt-off-screen-nav-push-top ~ [data-effeckt-page] {
    transition: 500ms; }

.effeckt-off-screen-nav-push-bottom {
  width: 100%;
  top: auto;
  transition: 500ms;
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%); }
  .effeckt-off-screen-nav-push-bottom.effeckt-show {
    visibility: visible;
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }
    .effeckt-off-screen-nav-push-bottom.effeckt-show ~ [data-effeckt-page] {
      -webkit-transform: translateY(-12rem);
          -ms-transform: translateY(-12rem);
              transform: translateY(-12rem); }
  .effeckt-off-screen-nav-push-bottom ~ [data-effeckt-page] {
    transition: 500ms; }

.effeckt-off-screen-nav-right-rotate {
  left: auto;
  right: 0;
  -webkit-transform-origin: 100% 50%;
      -ms-transform-origin: 100% 50%;
          transform-origin: 100% 50%;
  transition: 500ms;
  -webkit-transform: rotateY(30deg) translateX(100%) scale(1.01);
          transform: rotateY(30deg) translateX(100%) scale(1.01); }
  .effeckt-off-screen-nav-right-rotate ~ [data-effeckt-page] {
    -webkit-transform-origin: 100% 50%;
        -ms-transform-origin: 100% 50%;
            transform-origin: 100% 50%;
    transition: 500ms; }
  .effeckt-off-screen-nav-right-rotate ~ .effeckt-overlay {
    z-index: 900;
    visibility: visible;
    opacity: 1; }
  .effeckt-off-screen-nav-right-rotate.effeckt-show {
    -webkit-transform: none;
        -ms-transform: none;
            transform: none; }
    .effeckt-off-screen-nav-right-rotate.effeckt-show ~ [data-effeckt-page] {
      -webkit-transform: translateX(-260px) rotateY(-15deg);
              transform: translateX(-260px) rotateY(-15deg);
      overflow: hidden; }
      .effeckt-off-screen-nav-right-rotate.effeckt-show ~ [data-effeckt-page]:after {
        background: none; }
    .effeckt-off-screen-nav-right-rotate.effeckt-show ~ [data-effeckt-page] .off-screen-nav-cover {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

.effeckt-off-screen-nav-top-card-deck {
  -webkit-perspective: 800px;
          perspective: 800px;
  bottom: auto;
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);
  width: 100%;
  overflow: visible;
  transition: -webkit-transform 250ms;
  transition: transform 250ms; }
  .effeckt-off-screen-nav-top-card-deck.effeckt-show {
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }
  .effeckt-off-screen-nav-top-card-deck h4 {
    position: relative;
    z-index: 300;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
    -webkit-transform-origin: 50% 0%;
        -ms-transform-origin: 50% 0%;
            transform-origin: 50% 0%;
    transition: all 250ms ease-out;
    display: block; }
    .effeckt-off-screen-nav-top-card-deck h4:active {
      -webkit-transform: rotateX(60deg);
              transform: rotateX(60deg); }
  .effeckt-off-screen-nav-top-card-deck ul {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    margin: 0; }
    .effeckt-off-screen-nav-top-card-deck ul li {
      transition: all 250ms ease-out;
      position: absolute;
      top: 0;
      z-index: 0;
      width: 100%;
      height: 100%;
      -webkit-transform: translateY(0px);
          -ms-transform: translateY(0px);
              transform: translateY(0px); }

.effeckt-off-screen-nav-bottom-card-deck {
  -webkit-perspective: 800px;
          perspective: 800px;
  top: auto;
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%);
  width: 100%;
  overflow: visible;
  transition: -webkit-transform 250ms;
  transition: transform 250ms; }
  .effeckt-off-screen-nav-bottom-card-deck.effeckt-show {
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }
  .effeckt-off-screen-nav-bottom-card-deck h4 {
    position: relative;
    z-index: 300;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
    -webkit-transform-origin: 50% 100%;
        -ms-transform-origin: 50% 100%;
            transform-origin: 50% 100%;
    transition: all 250ms ease-out;
    display: block; }
    .effeckt-off-screen-nav-bottom-card-deck h4:active {
      -webkit-transform: rotateX(-60deg);
              transform: rotateX(-60deg); }
  .effeckt-off-screen-nav-bottom-card-deck ul {
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    margin: 0; }
    .effeckt-off-screen-nav-bottom-card-deck ul li {
      transition: all 250ms ease-out;
      position: absolute;
      top: 0;
      z-index: 0;
      width: 100%;
      height: 100%;
      -webkit-transform: translateY(300px);
          -ms-transform: translateY(300px);
              transform: translateY(300px); }

.effeckt-off-screen-nav-left-bounce {
  transition: 500ms;
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%); }
  .effeckt-off-screen-nav-left-bounce.effeckt-show {
    visibility: visible;
    -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
            transform: translateX(0%);
    -webkit-animation: navFromLeftBounceIn 500ms both ease;
            animation: navFromLeftBounceIn 500ms both ease; }
  .effeckt-off-screen-nav-left-bounce.effeckt-hide {
    -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
            transform: translateX(-100%);
    -webkit-animation: navFromLeftBounceOut 500ms both ease;
            animation: navFromLeftBounceOut 500ms both ease; }

@-webkit-keyframes navFromLeftBounceIn {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%); }

  20% {
    padding-left: 0px;
    -webkit-transform: translateX(0%);
            transform: translateX(0%); }

  60% {
    padding-left: 20px; }

  100% {
    padding-left: 0px; } }

@keyframes navFromLeftBounceIn {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%); }

  20% {
    padding-left: 0px;
    -webkit-transform: translateX(0%);
            transform: translateX(0%); }

  60% {
    padding-left: 20px; }

  100% {
    padding-left: 0px; } }

@-webkit-keyframes navFromLeftBounceOut {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    padding-left: 0px; }

  40% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    padding-left: 20px; }

  80% {
    padding-left: 0px; }

  90%, 100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%); } }

@keyframes navFromLeftBounceOut {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    padding-left: 0px; }

  40% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    padding-left: 20px; }

  80% {
    padding-left: 0px; }

  90%, 100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%); } }

.effeckt-off-screen-nav-left-bounce-out {
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%);
  transition: 500ms; }
  .effeckt-off-screen-nav-left-bounce-out.effeckt-show {
    visibility: visible;
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }
  .effeckt-off-screen-nav-left-bounce-out.effeckt-hide {
    -webkit-animation: navFromLeftBounceOut 500ms both ease;
            animation: navFromLeftBounceOut 500ms both ease; }

.effeckt-off-screen-nav-right-bounce {
  left: auto;
  right: 0;
  transition: 500ms; }
  .effeckt-off-screen-nav-right-bounce.effeckt-show {
    visibility: visible;
    -webkit-animation: navFromRightBounceIn 500ms both ease;
            animation: navFromRightBounceIn 500ms both ease; }
  .effeckt-off-screen-nav-right-bounce.effeckt-hide {
    -webkit-animation: navFromRightBounceOut 500ms both ease;
            animation: navFromRightBounceOut 500ms both ease; }

@-webkit-keyframes navFromRightBounceIn {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%); }

  20% {
    padding-right: 0px;
    -webkit-transform: translateX(0%);
            transform: translateX(0%); }

  60% {
    padding-right: 20px; }

  100% {
    padding-right: 0px; } }

@keyframes navFromRightBounceIn {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%); }

  20% {
    padding-right: 0px;
    -webkit-transform: translateX(0%);
            transform: translateX(0%); }

  60% {
    padding-right: 20px; }

  100% {
    padding-right: 0px; } }

@-webkit-keyframes navFromRightBounceOut {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    padding-right: 0px; }

  40% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    padding-right: 20px; }

  80% {
    padding-right: 0px; }

  90%, 100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%); } }

@keyframes navFromRightBounceOut {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    padding-right: 0px; }

  40% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    padding-right: 20px; }

  80% {
    padding-right: 0px; }

  90%, 100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%); } }

.effeckt-off-screen-nav-right-bounce-out {
  left: auto;
  right: 0;
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
  transition: 500ms; }
  .effeckt-off-screen-nav-right-bounce-out.effeckt-show {
    visibility: visible;
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%); }
  .effeckt-off-screen-nav-right-bounce-out.effeckt-hide {
    -webkit-animation: navFromRightBounceOut 500ms both ease;
            animation: navFromRightBounceOut 500ms both ease; }

.effeckt-off-screen-nav-bottom-rotate {
  top: auto;
  width: 100%;
  -webkit-transform-origin: 100% 50%;
      -ms-transform-origin: 100% 50%;
          transform-origin: 100% 50%;
  transition: 500ms;
  -webkit-transform: translateY(100%) scale(1.01) rotateX(-30deg);
          transform: translateY(100%) scale(1.01) rotateX(-30deg); }
  .effeckt-off-screen-nav-bottom-rotate ~ [data-effeckt-page].effeckt-page-active {
    -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
            transform-origin: 0% 100%;
    transition: 500ms; }
  .effeckt-off-screen-nav-bottom-rotate ~ .effeckt-overlay {
    z-index: 900;
    visibility: visible;
    opacity: 1; }
  .effeckt-off-screen-nav-bottom-rotate.effeckt-show {
    -webkit-transform: none;
        -ms-transform: none;
            transform: none; }
    .effeckt-off-screen-nav-bottom-rotate.effeckt-show ~ [data-effeckt-page].effeckt-page-active {
      -webkit-transform: translateY(-260px) rotateX(15deg);
              transform: translateY(-260px) rotateX(15deg);
      overflow: hidden; }
      .effeckt-off-screen-nav-bottom-rotate.effeckt-show ~ [data-effeckt-page].effeckt-page-active:after {
        background: none; }
    .effeckt-off-screen-nav-bottom-rotate.effeckt-show ~ [data-effeckt-page] .off-screen-nav-cover {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

.effeckt-off-screen-nav-top-rotate {
  bottom: auto;
  width: 100%;
  -webkit-transform-origin: 50% 0%;
      -ms-transform-origin: 50% 0%;
          transform-origin: 50% 0%;
  transition: 500ms;
  -webkit-transform: translateY(-100%) scale(1.01) rotateX(30deg);
          transform: translateY(-100%) scale(1.01) rotateX(30deg); }
  .effeckt-off-screen-nav-top-rotate ~ [data-effeckt-page].effeckt-page-active {
    -webkit-transform-origin: 100% 0%;
        -ms-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    transition: 500ms; }
  .effeckt-off-screen-nav-top-rotate ~ .effeckt-overlay {
    z-index: 900;
    visibility: visible;
    opacity: 1; }
  .effeckt-off-screen-nav-top-rotate.effeckt-show {
    -webkit-transform: none;
        -ms-transform: none;
            transform: none; }
    .effeckt-off-screen-nav-top-rotate.effeckt-show ~ [data-effeckt-page].effeckt-page-active {
      -webkit-transform: translateY(260px) rotateX(-15deg);
              transform: translateY(260px) rotateX(-15deg);
      overflow: hidden; }
      .effeckt-off-screen-nav-top-rotate.effeckt-show ~ [data-effeckt-page].effeckt-page-active:after {
        background: none; }
    .effeckt-off-screen-nav-top-rotate.effeckt-show ~ [data-effeckt-page] .off-screen-nav-cover {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

.effeckt-off-screen-nav-minimize-reaveal {
  width: 100%;
  transition: 500ms; }
  .effeckt-off-screen-nav-minimize-reaveal ~ [data-effeckt-page].effeckt-page-active {
    transition: 500ms;
    box-shadow: 0px 0px 50px #CACACA;
    z-index: 1000; }
  .effeckt-off-screen-nav-minimize-reaveal li, .effeckt-off-screen-nav-minimize-reaveal h4 {
    transition: 500ms cubic-bezier(0.16, 0.86, 0.33, 0.97);
    -webkit-transform: translateX(5%);
        -ms-transform: translateX(5%);
            transform: translateX(5%);
    opacity: 0; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show h4 {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 500ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(1) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1125ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(2) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1250ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(3) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1375ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(4) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1500ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(5) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1625ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(6) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1750ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(7) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1875ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(8) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2000ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(9) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2125ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(10) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2250ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(11) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2375ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(12) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2500ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(13) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2625ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(14) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2750ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show li:nth-child(15) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2875ms; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show ~ [data-effeckt-page].effeckt-page-active {
    transition: 750ms cubic-bezier(0.16, 0.86, 0.33, 0.97);
    -webkit-transform: translateX(50%) scale3d(0.5, 0.5, 1);
            transform: translateX(50%) scale3d(0.5, 0.5, 1);
    overflow: hidden; }
  .effeckt-off-screen-nav-minimize-reaveal.effeckt-show ~ [data-effeckt-page] .off-screen-nav-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.effeckt-off-screen-nav-minimize-flip {
  width: 100%;
  transition: 500ms; }
  .effeckt-off-screen-nav-minimize-flip ~ [data-effeckt-page].effeckt-page-active {
    transition: 500ms;
    box-shadow: 0px 0px 50px #CACACA;
    z-index: 1000; }
  .effeckt-off-screen-nav-minimize-flip li, .effeckt-off-screen-nav-minimize-flip h4 {
    transition: 500ms cubic-bezier(0.16, 0.86, 0.33, 0.97);
    -webkit-transform: translateX(5%);
        -ms-transform: translateX(5%);
            transform: translateX(5%);
    opacity: 0; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show h4 {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 500ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(1) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1125ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(2) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1250ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(3) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1375ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(4) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1500ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(5) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1625ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(6) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1750ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(7) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 1875ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(8) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2000ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(9) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2125ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(10) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2250ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(11) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2375ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(12) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2500ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(13) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2625ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(14) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2750ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show li:nth-child(15) {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
    transition-delay: 2875ms; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show ~ [data-effeckt-page].effeckt-page-active {
    transition: 750ms cubic-bezier(0.16, 0.86, 0.33, 0.97);
    -webkit-transform: translateX(50%) rotateY(-15deg) scale3d(0.5, 0.5, 1);
            transform: translateX(50%) rotateY(-15deg) scale3d(0.5, 0.5, 1);
    overflow: hidden; }
  .effeckt-off-screen-nav-minimize-flip.effeckt-show ~ [data-effeckt-page] .off-screen-nav-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
